質問編集履歴
4
CORSのエラー文追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -12,6 +12,11 @@
|
|
|
12
12
|
もし同じ状況で解決された方がいらっしゃれば、お知恵お借りしたいです。
|
|
13
13
|
（APIは片方だけ叩くのは問題ありません。）
|
|
14
14
|
|
|
15
|
+
CORSエラーは一般的なCORSエラーと思います。
|
|
16
|
+
```
|
|
17
|
+
Access to XMLHttpRequest at 'http://localhost:8080/wp-json/wp/v2/posts/' from origin 'http://localhost:3000' has been blocked by CORS policy: Request header field access-control-allow-origin is not allowed by Access-Control-Allow-Headers in preflight response.
|
|
18
|
+
```
|
|
19
|
+
|
|
15
20
|
### 試したこと
|
|
16
21
|
|
|
17
22
|
nuxt.config.jsに下記記載してみましたが、ダメそうでした。
|
3
APIを叩く箇所のコードを追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -35,4 +35,9 @@
|
|
|
35
35
|
axios.defaults.baseURL = 'http://localhost:3001'
|
|
36
36
|
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
|
|
37
37
|
axios.defaults.headers['Access-Control-Allow-Origin'] = '*'
|
|
38
|
+
```
|
|
39
|
+
APIを叩く際にフルパスで下記のようにすると、axiosのbaseURLで指定していないほうがCORSエラーとなります。
|
|
40
|
+
```
|
|
41
|
+
let { postData } = await axios.get('http://localhost:8080/wp-json/wp/v2/posts/')
|
|
42
|
+
let { data } = await axios.get('http://localhost:3001/api/v1/favorites')
|
|
38
43
|
```
|
2
modules追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -17,6 +17,10 @@
|
|
|
17
17
|
nuxt.config.jsに下記記載してみましたが、ダメそうでした。
|
|
18
18
|
proxyの理解が正しくないのかもしれませんが…。
|
|
19
19
|
```js
|
|
20
|
+
modules: [
|
|
21
|
+
'@nuxtjs/axios',
|
|
22
|
+
'@nuxtjs/proxy'
|
|
23
|
+
],
|
|
20
24
|
axios: {
|
|
21
25
|
proxy: true
|
|
22
26
|
},
|
1
片方だけのAPIを叩いた場合を追記しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
（Go：3001ポート、WP：8080ポート）
|
|
11
11
|
どうしてもaxiosのbaseURLに指定している localhost:3001 へAPI通信をしに行ってしまいます。
|
|
12
12
|
もし同じ状況で解決された方がいらっしゃれば、お知恵お借りしたいです。
|
|
13
|
+
（APIは片方だけ叩くのは問題ありません。）
|
|
13
14
|
|
|
14
15
|
### 試したこと
|
|
15
16
|
|