0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

AmplifyをLambdaを使って動的に動かす

Posted at

Amplifyが動的に動かせると思っていた

Amplifyでは以下のようにpythonファイルを指定しても呼べなかった。

  • 修正前

    <script>
        var callAPI = (input)=>{
            var myHeaders = new Headers();
            console.log(input)
            myHeaders.append("Content-Type", "text/html");
            var requestOptions = {
                method: 'POST',
                headers: myHeaders,
                body: input,
                redirect: 'follow'
            };
            fetch("test.py", requestOptions)
            .then(response => response.text())
            .then(result => console.log('success', result))
            .catch(error => console.log('error', error));
        }
    </script>
</head>
<body>
    <form>
        <label>文字を入力してください</label>
        <input type="text" id="input">
        <button type="button" onclick="callAPI(document.getElementById('input').value)">入力</button>
    </form>
</body>

htmlから呼び出したいpythonファイルをLambdaにほぼコピペしたら実行したいpythonプログラムを実行できた。
動的にするにはただデプロイするだけでは足りないよう。

  • 修正後
<body>
    <form>
        <label for="inhput" class="cl1">文字を入力してください</label>
        <input type="text" id="input">
        <button type="button" onclick="callAPI(document.getElementById('input').value)">入力</button>
    </form>
    <script>
        var callAPI = (input)=>{
            var myHeaders = new Headers();
            myHeaders.append("Content-Type", "application/json");
            var raw = JSON.stringify({"input":input});
            var requestOptions = {
                method: 'POST',
                headers: myHeaders,
                body: raw,
                redirect: 'follow'
            };
            fetch("ここにAPI GatewayのURLを書く", requestOptions)
            .then(response => response.text())
            .then(result => alert(JSON.parse(result).body))
            .catch(error => console.log('error', error));
        }
    </script>
</body>

参考記事

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?