テキストをクリップボードにコピーするボタンの実装

Question

ハッシュタグをコピーするボタンを作成しているのですが、どうもスマホの時にうまくコピーされません。
PCの場合はしっかりとクリップボードにコピーされます。

onclick属性を使って、htmlに直接書き込む方法もある様ですが、それでもスマホの時にはコピーできませんでした。

参考サイト
こちらのサイトはスマホでもコピーできました
https://www.marorika.com/entry/copy-to-clipboard

このサイトのやり方を真似ているのですが、スマホだとうまく行きません。
https://designsupply-web.com/media/knowledgeside/4035/

いろいろな参考サイトを見ましたが、スマホでコピーできるのとできないのとまちまちでした。

<input type="text" value="#髪はじめました" id="instagram__tag" class="startedApply__stepList__input" readonly>
<button class="button startedApply__stepList__linkButton" id="btn_copy">ハッシュタグをコピーする</button>

function copyTags() {
    // コピー対象の要素を取得
    var target = document.getElementById('instagram__tag');
    if (navigator.userAgent.match(/ipad|ipod|iphone/i)) {
      target.readOnly = false;
      const range = document.createRange();
      range.selectNode(target);
      window.getSelection().addRange(range);
      document.execCommand('copy');
      target.readOnly = true;
    } else {
      target.select();
      document.execCommand('copy');
    }
    alert("text copied!!");
  }

    const trg = document.getElementById('btn_copy');
    trg.addEventListener('click',copyTags);

原因分かりますでしょうか？

Comments

[m.ts10806]

>どうもスマホの時に

機種は何でしょうか。
分岐を見るとiOS系とそれ以外になっているようですが

[_T_S]

iphone11でiosのバージョンは最新です。

[m.ts10806]

質問本文に追記してください。
※ただ当方Androidしかないので実機確認できなさそうですが

[m.ts10806]

ブラウザはSafariですよね。

[m.ts10806]

Androidは問題なさそうですね（Chrome、Firefox）
条件分岐なくして、両方とも↓でいった場合はどうですか？
target.select();
document.execCommand('copy');

[_T_S]

ありがとうございます。
試してみます。

Answer 1

回答のつもりだったんですが、回答ではなくなりました^^;

数年前に Safari で使用できるライブラリを教えてもらったことがあります。

モバイル端末でのクリップボードへのコピー - teratail

で、紹介いただいたライブラリは数年間使用に耐えたので、clipboard.js の実装を調べてみては？
と回答しようと思ったのですが、どうやら今現在は問題があるようです。

clipboardJS relies on execCommand which is now obsolete and could be removed. Any plans for alternatives? #683

Document.execCommand()

Obsolete

This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.

ちゃんと調べてないですけど、この辺の話なのでは？

対応しなければならない端末によっては、結構実装が複雑になるはずなので、後継ライブラリを探してみると良いかも。