FLASK 프레임워크 에서 카카오맵 불러오기가 안돼요

FLASK 프레임워크 에서
app.py를 다음과 같이 작성했습니다.

from flask import Flask, render_template, request

from flask_mysqldb import MySQL

app = Flask(__name__)

app.config['MYSQL_HOST'] = 'localhost'  # MySQL 호스트 주소

app.config['MYSQL_PORT'] = 3306

app.config['MYSQL_USER'] = 'root'  # MySQL 사용자명

app.config['MYSQL_PASSWORD'] = '0000'  # MySQL 비밀번호

app.config['MYSQL_DB'] = 'control_second_project'  # 사용할 데이터베이스명

mysql = MySQL(app)

@app.route('/')

def index():

    return render_template('index.html')

# 홈에서 html로 이동하기 위한 controller

@app.route('/Geolocation')

def Geolocation():

    return render_template('Geolocation.html')

@app.route('/locationManagement')

def locationManagement():

    return render_template('locationManagement.html')

@app.route('/member')

def member():

    return render_template('member.html')

@app.route('/a')

def a():

    return render_template('a.html')

# 이동용 Controller 끝

# db insert 예제

@app.route('/insert', methods=['POST'])

def insert_data():

    if request.method == 'POST':

        name = request.form['name']

        # 여기에서 필요한 데이터를 받아온 후 MySQL 데이터베이스에 삽입하는 쿼리를 실행합니다.

        cur = mysql.connection.cursor()

        cur.execute("INSERT INTO register (name) VALUES (%s)", (name,))

        mysql.connection.commit()

        cur.close()

        return 'Data inserted successfully'

    return render_template('insert.html')

if __name__ == '__main__':

    app.run()

그리고 a.html을 다음과 같이 작성했어요. 카카오맵을 불러오려고 다음과 같이 만들었어요

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

<div id="map" style="width:100%;height:350px;"></div>

<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=인증키"></script>

<script>

var mapContainer = document.getElementById('map'), // 지도를 표시할 div

    mapOption = {

        center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표

        level: 3 // 지도의 확대 레벨

    };

// 지도를 표시할 div와  지도 옵션으로  지도를 생성합니다

var map = new kakao.maps.Map(mapContainer, mapOption);

</script>

</body>

</html>

eclipse의 spring legacy 프로젝트에서는 카카오맵 api 가 잘 불러와지는데
왜 여기서는 말썽일까요?

인증키는 정확하게 입력 했습니다. gpt에게 물어봐도 도저히 이유를 찾지 못 하겠습니다 ㅜㅜ

GET http://dapi.kakao.com/v2/maps/sdk.js?appkey=22b965a30a965cd617970bdb7888a5fd net::ERR_ABORTED 401 (Unauthorized)

에러가 떠서 kakaoMap api 관련된 명령어가 나오면 javaScript가 처리하지 못 해요

내 애플리캐이션에 사이트 도메인이 등록되어있지 않았습니다 ㅠㅠ 해결했어요

1개의 좋아요