質問編集履歴

1

コードの追記

2023/06/19 03:03

投稿

nosuke09
nosuke09

スコア9

test CHANGED
File without changes
test CHANGED
@@ -25,3 +25,75 @@
25
25
  外部jsの読み込み方法です。PCでは動作しているので
26
26
  ローカルではない、外部からのアクセスに問題があって書き方を変える必要があるのか、スマホ特有のエラーにより書き換えの必要があるかなど知りたいです。
27
27
 
28
+ ### 追記
29
+ ファイルの開示ですが、公開できないコードなので中途半端な説明になってしまいました。
30
+
31
+ ・スマホはiOSでブラウザはSafariです。
32
+ ・PCはmacでブラウザはGoogleChromeですが、Safariでの動作も確認できてます。
33
+ ・script内にasync関数は入っています。PCローカルのjsonファイルの受け渡しをする必要があるため非同期関数にしています。jsonファイルの受け渡し自体はスマホブラウザでも確認できました。
34
+
35
+ 最後に大まかなコードの流れだけになってしまいますが載せておきます。
36
+ ただ、下記のように簡単なコードを作成すると普通に動作したのでjsファイルの読み込みが悪いのではなく、外部jsファイルの中身自体がスマホで動作しないコードがあるのかもしれないです...
37
+
38
+ ```html
39
+ <!DOCTYPE html>
40
+ <html>
41
+ <head>
42
+ <title>HTMLテンプレート</title>
43
+ <button onclick="createSentence()">クリック</button>
44
+ </head>
45
+ <body>
46
+ <h1>Hello, World!</h1>
47
+ <script src="../path/example.js"></script>
48
+ <script>
49
+ const url1 = "http://IPアドレス:5500/path/file.json";
50
+ const url2 = "http://IPアドレス:5500/path/file2.json";
51
+
52
+
53
+ let file1 = { key1: "value1", };
54
+ let file2= { key1: "value1", };
55
+ // jsonファイルの受け取り
56
+ const fetchData = async () => {
57
+ try {
58
+ await Promise.all([
59
+ fetch(url1).then((response) => response.json()),
60
+ fetch(url2).then((response) => response.json()),
61
+ ])
62
+ .then((data) => {
63
+ file1 = data[0];
64
+ file2 = data[1];
65
+ })
66
+ .catch((err) => {
67
+ console.error("JSONファイルの取得に失敗しました", err);
68
+ });
69
+ } catch (err) {
70
+ console.log(err);
71
+ }
72
+ };
73
+
74
+ fetchData();
75
+
76
+ const example = new Example(1, 2);
77
+
78
+ const createSentence = async () => {
79
+ alert(example._add());
80
+ };
81
+ </script>
82
+ </body>
83
+ </html>
84
+
85
+ ```
86
+ ```javascript:example.js
87
+ class Example {
88
+ constructor(a, b) {
89
+ this._a = a;
90
+ this._b = b;
91
+ }
92
+
93
+ _add() {
94
+ const c = this._a + this._b
95
+ return c;
96
+ }
97
+ }
98
+ ```
99
+