実現したいこと
- Next.jsのサイトでPaidy決済を導入する
前提
初心者です。
Next.js、TypeScriptでPaidy決済機能を作りたいです。
ガイドラインに従ってチェックアウトアプリを導入したいですが、外部スクリプトが読み込めていないです。
ガイドライン:https://paidy.com/docs/jp/paidycheckout.html#int_pay
発生している問題・エラーメッセージ
名前 'Paidy' が見つかりません。ts(2304)
該当のソースコード
_app.tsx
JavaScript
1 return ( 2 <> 3 <Head /> 4 <Script 5 type="text/javascript" 6 src="https://apps.paidy.com/" 7 /> 8 <ManagedUIContext> 9 <Layout pageProps={pageProps}> 10 <Component {...pageProps} /> 11 </Layout> 12 </ManagedUIContext> 13 </> 14 )
Order.tsx
JavaScript
1import { useEffect } from 'react'; 2 3function MyPage() { 4 useEffect(() => { 5~略 6var config = { 7 "api_key": "pk_0000_000000000000000", 8 "logo_url": "http://www.paidy.com/images/logo.png", 9 "closed": function(callbackData: any) { 10 /* 11 Data returned in the callback: 12 */ 13 } 14}; 15var paidyHandler = Paidy.configure(config); ←エラー 16function paidyPay() { 17 var payload = { 18 "amount": 10000, 19 "currency" : "JPY", 20 "store_name": "Paidy sample store", 21 "buyer": { 22 "email": "successful.payment@paidy.com", 23 "name1": "山田 太郎", 24 "name2": "ヤマダ タロウ", 25 "phone" : "08000000001", 26 "dob": "1990-10-25" 27 }, 28~ 29 }, []); 30 31 return ( 32 <div> 33 {/* ページコンテンツ */} 34 </div> 35 ); 36} 37 38export default MyPage;
試したこと
- scriptタグの読み込む場所を色々変える
- useEffectの中に入れ、マウント時のみ読み込むようにしましたがエラーになります。。
補足情報(FW/ツールのバージョンなど)

回答1件
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
また依頼した内容が修正された場合は、修正依頼を取り消すようにしましょう。
2023/05/20 13:56
2023/05/21 13:05
2023/05/21 13:19