{"id":659,"date":"2024-06-17T11:36:00","date_gmt":"2024-06-17T11:36:00","guid":{"rendered":"https:\/\/www.freelifemakers.org\/wordpress\/?p=659"},"modified":"2024-06-17T14:39:48","modified_gmt":"2024-06-17T14:39:48","slug":"reactnative","status":"publish","type":"post","link":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/2024\/06\/17\/reactnative\/","title":{"rendered":"[ReactNative] \uc6f9\ubdf0\uc5d0\ub7ec \/ webview error"},"content":{"rendered":"\n<p>\ub9ac\uc561\ud2b8\ub124\uc774\ud2f0\ube0c\ub85c \uc571\uac1c\ubc1c\ud558\ub2e4 \ubcf4\uba74 \uc6f9\ubdf0\ub97c \uc0ac\uc6a9\ud558\uac8c \ub429\ub2c8\ub2e4.<br>\uc6f9\ubdf0\ub294 \ubaa8\ubc14\uc77c\ud3f0 \ub0b4\uc5d0\uc11c \ube0c\ub77c\uc6b0\uc800\ub791 \uac70\uc758 \ub3d9\uc77c\ud55c \uc5ed\ud560\uc744 \ud569\ub2c8\ub2e4.<br>\ud558\uc9c0\ub9cc \uc6f9\ubdf0\ub294 \ub354 \uc138\ubd80\uc801\uc778 \uae30\ub2a5\uc774\ub098 \uc124\uc815\uc774 \ud544\uc694\ud569\ub2c8\ub2e4.<\/p>\n\n\n\n<p>When developing apps with React Native, you will use webviews.<br>Webview plays almost the same role on a mobile phone as a browser on a PC.<br>However, webviews require more detailed functions or settings.<\/p>\n\n\n\n<p>\uc774\ubc88 \uc2dc\uac04\uc5d0 \uc5ec\uae30\uc11c \ub2e4\ub8f0 \uac74 \uc6f9\ubdf0 \ubcf4\uc548 \uc124\uc815 \ubb38\uc81c\uc785\ub2c8\ub2e4.  <br>expo\ub85c \uac1c\ubc1c\ud558\ub2e4\uac00 \ud14c\uc2a4\ud2b8 \ud560\ub54c \uc815\uc0c1\uc801\uc73c\ub85c \uc798 \ub418\uc9c0\ub9cc apk\ud30c\uc77c\uc744 \ub9cc\ub4e4\uba74 \uc6f9\ubdf0 \ud654\uba74\uc5d0\uc11c \uc5d0\ub7ec\uac00 \ubc1c\uc0dd\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<br>\uc774\ub54c\ub294 \uace0\ubbfc\ud558\uc9c0\ub9c8\uc2dc\uace0 \ub9ac\uc561\ud2b8\ub124\uc774\ud2f0\ube0c cli\ub85c \ud504\ub85c\uc81d\ud2b8 \ubc14\uafb8\ub294 \uac83\uc744 \ucd94\ucc9c\ub4dc\ub9bd\ub2c8\ub2e4.<br>\uc544\ub798\uc5d0 \uc124\uc815\uc740 \ub9ac\uc561\ud2b8\ub124\uc774\ud2f0\ube0c cli\uc5d0\uc11c \uc124\uc815 \uac00\ub2a5\ud569\ub2c8\ub2e4.<\/p>\n\n\n\n<p>What we will cover this time is the issue of webview security settings.<br>When developing and testing with expo, it works normally, but when creating an apk file, an error may occur on the webview screen.<br>At this time, I recommend that you change the project to React Native cli.<\/p>\n\n\n\n<p>\uc124\uc815\ud558\ub294\uac74 \uac04\ub2e8\ud569\ub2c8\ub2e4. \uc5ec\ub7ec\ubd84\uc758 \ud504\ub85c\uc81d\ud2b8 \uacbd\ub85c\uc5d0\uc788\ub294 AndroidManifest.xml\ud30c\uc77c\uc744 vscode\ub85c \uc624\ud508\ud569\ub2c8\ub2e4.<br> It&#8217;s simple to set up. Open the AndroidManifest.xml file in your project path with vscode.<br><strong>project\/android\/app\/src\/main\/AndroidManifest.xml<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"312\" height=\"402\" src=\"https:\/\/www.freelifemakers.org\/wordpress\/wp-content\/uploads\/2024\/06\/AndroidManifest.png\" alt=\"\" class=\"wp-image-662\" srcset=\"https:\/\/www.freelifemakers.org\/wordpress\/wp-content\/uploads\/2024\/06\/AndroidManifest.png 312w, https:\/\/www.freelifemakers.org\/wordpress\/wp-content\/uploads\/2024\/06\/AndroidManifest-233x300.png 233w\" sizes=\"auto, (max-width: 312px) 100vw, 312px\" \/><\/figure>\n\n\n\n<p>\ud30c\uc77c\uc774 \uc624\ud508\ub418\uba74 <strong>&lt;application <\/strong>\ub2e4\uc74c \ubd80\ubd84\uc5d0 <strong>android:usesCleartextTraffic=&#8221;true&#8221; <\/strong>\ub97c \ucd94\uac00\ud569\ub2c8\ub2e4.<br>When the file is opened, add android:usesCleartextTraffic=&#8221;true&#8221; to the part after &lt;application.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"633\" height=\"292\" src=\"https:\/\/www.freelifemakers.org\/wordpress\/wp-content\/uploads\/2024\/06\/AndroidManifest2.png\" alt=\"\" class=\"wp-image-663\" srcset=\"https:\/\/www.freelifemakers.org\/wordpress\/wp-content\/uploads\/2024\/06\/AndroidManifest2.png 633w, https:\/\/www.freelifemakers.org\/wordpress\/wp-content\/uploads\/2024\/06\/AndroidManifest2-300x138.png 300w\" sizes=\"auto, (max-width: 633px) 100vw, 633px\" \/><\/figure>\n\n\n\n<p>\uc800\uc7a5\ud558\uace0 \ud130\ubbf8\ub110\uc5d0\uc11c <strong>npm run android<\/strong>\ub85c \uc548\ub4dc\ub85c\uc774\ub4dc \uc571\uc744 \uc2dc\uc791\ud569\ub2c8\ub2e4. <br>Save and start the Android app with &#8220;npm run android&#8221; in terminal.<br><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\ub9ac\uc561\ud2b8\ub124\uc774\ud2f0\ube0c\ub85c \uc571\uac1c\ubc1c\ud558\ub2e4 \ubcf4\uba74 \uc6f9\ubdf0\ub97c \uc0ac\uc6a9\ud558\uac8c \ub429\ub2c8\ub2e4.\uc6f9\ubdf0\ub294 \ubaa8\ubc14\uc77c\ud3f0 \ub0b4\uc5d0\uc11c \ube0c\ub77c\uc6b0\uc800\ub791 \uac70\uc758 \ub3d9\uc77c\ud55c \uc5ed\ud560\uc744 \ud569\ub2c8\ub2e4.\ud558\uc9c0\ub9cc \uc6f9\ubdf0\ub294 \ub354 \uc138\ubd80\uc801\uc778 \uae30\ub2a5\uc774\ub098 \uc124\uc815\uc774 \ud544\uc694\ud569\ub2c8\ub2e4. When developing apps with React Native, you will use webviews.Webview plays almost the same role on a mobile phone as a browser on a PC.However, webviews require more detailed functions or settings. \uc774\ubc88 \uc2dc\uac04\uc5d0 \uc5ec\uae30\uc11c \ub2e4\ub8f0 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"class_list":["post-659","post","type-post","status-publish","format-standard","hentry","category-reactnative","missing-thumbnail"],"_links":{"self":[{"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/posts\/659","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/comments?post=659"}],"version-history":[{"count":4,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/posts\/659\/revisions"}],"predecessor-version":[{"id":668,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/posts\/659\/revisions\/668"}],"wp:attachment":[{"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/media?parent=659"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/categories?post=659"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.freelifemakers.org\/wordpress\/index.php\/wp-json\/wp\/v2\/tags?post=659"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}